<template>
  <el-dialog
    title="查看公告"
    :visible.sync="isShowModel"
    :before-close="handleClose"
    @close="$emit('update:isShowDetail', false)"
    class="searchNotice">
       <el-form :model="noticeInfo" label-width="120px">
         <el-form-item label="公告标题：">
          {{noticeInfo.name}}
         </el-form-item>
         <el-form-item label="创建者：">
           {{noticeInfo.creatername}}
         </el-form-item>
         <el-form-item label="是否展示：">
           <el-switch
             v-model="noticeInfo.isShow == 0 ? false : true"
             active-color="#13ce66"
             inactive-color="#ff4949" disabled>
           </el-switch>
         </el-form-item>
         <el-form-item label="展示对象：">
           <div v-if="noticeInfo.terminal == '0'">全部</div>
           <div v-if="noticeInfo.terminal == '1'">买家端</div>
           <div v-if="noticeInfo.terminal == '2'">卖家端</div>
         </el-form-item>
         <el-form-item label="公告内容：">
           <div v-html="noticeInfo.content"></div>
         </el-form-item>
         <el-form-item label="展示时间段：">
           {{noticeInfo.startTime}} ~ {{noticeInfo.endTime}}
         </el-form-item>
       </el-form>
  </el-dialog>
</template>

<script>
    export default {
        name: "SearchNotice",
        props: {
          isShowDetail: {
            type: Boolean,
            default: false
          },
          dataInfo: {
            type: Object,
            default: () => {}
          }
        },
        data() {
          return {
            isShowModel: this.isShowDetail,
            noticeInfo: this.dataInfo
          }
        },
        methods: {
          handleClose(done) {
            done()
          }
        },
        watch: {
          isShowDetail(val) {
            this.isShowModel = val
          },
          dataInfo() {
            this.noticeInfo = this.dataInfo
          }
        }
    }
</script>

<style lang="scss">
  .searchNotice {
    .el-dialog {
      width: 500px!important;
      .el-form-item {
        margin-bottom: 5px;
      }
    }
  }
</style>
